<template>
	<div>
		<h4>toRef</h4>
		<p>{{state.foo}}</p>
		<p>{{fooRef}}</p>
	</div>
</template>
<script setup>

import {toRef,reactive} from 'vue'
const state = reactive({
  foo: 1,
  bar: 2
})

const fooRef = toRef(state,'foo')
fooRef.value = 10
</script>